<template>
  <div class="exampleitem-top">
    <NavHeader />
    <div class="exampleitem-top-content">
      <h1>AI分析助手驱动企业数据治理与服务创新</h1>
      <h3>
        友盟智能科技为您提供全面、高效、精准的数据清洗和申诉管理解决方案，确保数据的准确性、
        一致性和完整性。
      </h3>
    </div>
  </div>
  <div class="exampleitem-center">
    <div class="exampleitem-center-item" v-for="(item, index) in list">
      <div class="exampleitem-center-item-content">
        <h1>{{ item.title }}</h1>
        <h3>{{ item.descs }}</h3>
      </div>
      <img :src="item.img" alt="" />
    </div>
  </div>
  <BackTop />
  <Recommend backColor="#fff" />
  <pageBottom />
</template>
<script lang="ts" setup>
import { ref, reactive, computed, onMounted, watch } from "vue";
import NavHeader from "@/components/NavHeader.vue";
import Recommend from "@/components/Recommend.vue";
import pageBottom from "@/components/pageBottom.vue";
import BackTop from "@/components/BackTop.vue";
import item1 from "@/assets/img/exampleitem4/item1.png";
import item2 from "@/assets/img/exampleitem4/item2.png";
import item3 from "@/assets/img/exampleitem4/item3.png";
import item4 from "@/assets/img/exampleitem4/item4.png";
import item5 from "@/assets/img/exampleitem4/item5.png";
import item6 from "@/assets/img/exampleitem4/item6.png";
import item7 from "@/assets/img/exampleitem4/item7.png";

let list = reactive([
  {
    title: "AI对话",
    descs:
      "通过自然语言处理技术，实现与用户的智能对话，提供人性化的交互体验，提升客户服务效率。",
    img: item1,
  },
  {
    title: "产品评论分析",
    descs:
      "搜集和分析全网产品评论，追踪消费者情感和热点话题，为企业提供精准的市场洞察和产品改进建议，",
    img: item2,
  },
  {
    title: "产品销量分析",
    descs:
      "综合分析销售数据，生成动态销售图表，帮助企业清晰了解市场趋势，制定有效的销售策略",
    img: item3,
  },
  {
    title: "制度检索",
    descs:
      "高效检索公司内部规章制度，一键获取详细规章，提高企业内部管理效率和合规性。",
    img: item4,
  },
  {
    title: "客户服务",
    descs:
      "AI助手能够自动处理大量客户咨询，提供24/7不间断服务，快速响应客户需求，提升客户满意度和忠诚度。",
    img: item5,
  },
  {
    title: "运营管理",
    descs:
      "通过自动化流程和智能决策支持，AI助手帮助企业优化运营流程，提高工作效率，减少人为错误，实现精细化管理。",
    img: item6,
  },
  {
    title: "市场营销",
    descs:
      "利用AI助手分析市场数据和消费者行为，企业可以制定更有针对性的营销策略，提高营销活动的ROI，增强市场竞争力。",
    img: item7,
  },
]);
</script>
<style lang="scss" scoped>
.exampleitem-top {
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-image: url("@/assets/img/exampleitem4/bg.png");
  height: 100vh;
  position: relative;
  &::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.4784313725);
  }
  &-content {
    position: absolute;
    margin-left: 18%;
    top: 50%;
    h1 {
      margin-bottom: 20px;
      font-weight: 700;
      font-size: 35px;
    }
  }
}
.exampleitem-center {
  color: #000;
  padding: 50px;
  background-color: #fff;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 65%;
  margin: auto;
  &-item {
    width: 47%;
    text-align: center;
    background-color: #f3f3f6;
    border-radius: 20px;
    margin-bottom: 40px;
    overflow: hidden;
    &-content {
      padding: 60px 30px;
      h1 {
        margin-bottom: 10px;
      }
      h3 {
        color: #666;
      }
    }
    img {
      width: 100%;
      transform: translateY(15px);
    }
  }
}
</style>
